<template>
    <div class="app-container">
        <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
            <el-form-item label="标题" prop="title">
                <el-input v-model="queryParams.title" placeholder="请输入标题" clearable @keyup.enter.native="handleQuery"/>
            </el-form-item>
            <el-form-item label="密级" prop="secretLevel">
                <el-select v-model="queryParams.secretLevel" placeholder="请选择密级" clearable>
                    <el-option v-for="dict in dict.type.offical_doc_encryption_level" :key="dict.value" :label="dict.label" :value="dict.value"/>
                </el-select>
            </el-form-item>
            <el-form-item label="年份" prop="year">
                <el-input v-model="queryParams.year" placeholder="请输入年份" clearable @keyup.enter.native="handleQuery"/>
            </el-form-item>
            <el-form-item label="第几号文" prop="num">
                <el-input v-model="queryParams.num" placeholder="请输入第几号文" clearable @keyup.enter.native="handleQuery"/>
            </el-form-item>
            <el-form-item label="企字" prop="qizi">
                <el-input v-model="queryParams.qizi" placeholder="请输入企字" clearable @keyup.enter.native="handleQuery"/>
            </el-form-item>
            <el-form-item>
                <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
                <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
            </el-form-item>
        </el-form>

        <TableCard>
            <el-row :gutter="10" class="mb8">
                <el-col :span="1.5">
                    <el-button type="primary" plain icon="el-icon-plus" size="mini" @click="handleAdd" v-hasPermi="['oa:officalDoc:add']">
                        新增
                    </el-button>
                </el-col>
                <el-col :span="1.5">
                    <el-button type="warning" plain icon="el-icon-download" size="mini" @click="handleExport" v-hasPermi="['oa:officalDoc:export']">
                        导出
                    </el-button>
                </el-col>
                <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
            </el-row>

            <el-table :border="Global.tableShowBorder" v-loading="loading" :data="officalDocList">
                <el-table-column type="selection" width="55" align="center"/>
                <el-table-column label="单据编码" align="center" prop="billCode" width="180"/>
                <el-table-column label="套红模版" align="center" prop="tplName" width="300"/>
                <el-table-column label="标题" align="center" prop="title" width="350" :show-overflow-tooltip="true"/>
                <el-table-column label="密级" align="center" prop="secretLevel" width="150">
                    <template slot-scope="scope">
                        <dict-tag :options="dict.type.offical_doc_encryption_level" :value="scope.row.secretLevel"/>
                    </template>
                </el-table-column>
                <el-table-column label="保密期间" align="center" prop="secretPeriod" width="150">
                    <template slot-scope="scope">
                        <dict-tag :options="dict.type.offical_doc_secret_period" :value="scope.row.status"/>
                    </template>
                </el-table-column>
                <el-table-column label="紧急程度" align="center" prop="emergentLevel" width="150">
                    <template slot-scope="scope">
                        <dict-tag :options="dict.type.offical_doc_emergent_level" :value="scope.row.status"/>
                    </template>
                </el-table-column>
                <el-table-column label="公开类别" align="center" prop="publicCategory" width="150">
                    <template slot-scope="scope">
                        <dict-tag :options="dict.type.offical_doc_public_category" :value="scope.row.status"/>
                    </template>
                </el-table-column>
                <el-table-column label="年份" align="center" prop="year" width="150"/>
                <el-table-column label="第几号文" align="center" prop="num" width="150"/>
                <el-table-column label="企字" align="center" prop="qizi" width="150"/>
                <el-table-column label="起草状态" align="center" prop="draftStatus" width="150">
                    <template slot-scope="scope">
                        <span v-if="scope.row.draftStatus=='0'" style="color: #1ab394">起草中</span>
                        <span v-if="scope.row.draftStatus=='1'" style="color: #ff6666">已签章</span>
                    </template>
                </el-table-column>
                <el-table-column label="流程状态" align="center" prop="status" width="150">
                    <template slot-scope="scope">
                        <dict-tag :options="dict.type.oa_flow_billstatus" :value="scope.row.status"/>
                    </template>
                </el-table-column>
                <el-table-column label="操作" align="center" class-name="small-padding fixed-width" width="450" fixed="right">
                    <template slot-scope="scope">
                        <el-button size="mini" type="text" v-show="scope.row.status=='0' || scope.row.status=='3'"  icon="el-icon-check" @click="doSubmitFlow(scope.row)" v-hasPermi="['oa:officalDoc:edit']">提交审批</el-button>
                        <el-button size="mini" type="text" v-show="scope.row.status=='0' || scope.row.status=='3'"  icon="el-icon-edit" @click="handleUpdate(scope.row)" v-hasPermi="['oa:officalDoc:edit']">修改</el-button>
                        <el-button size="mini" type="text" v-show="scope.row.status=='0' || scope.row.status=='3'"  icon="el-icon-delete" @click="handleDelete(scope.row)" v-hasPermi="['oa:officalDoc:remove']">删除</el-button>

                        <el-button size="mini" type="text" v-show="scope.row.status=='1'"  icon="el-icon-refresh-right" @click="doCancleFlow(scope.row)" v-hasPermi="['oa:officalDoc:edit']" style="color: #ff6666">撤销申请</el-button>
                        <el-button size="mini" type="text" v-show="scope.row.status!='0'"  icon="el-icon-rank"          @click="flowDetail(scope.row)" v-hasPermi="['oa:officalDoc:edit']">流程信息</el-button>
                        <el-button size="mini" type="text" v-show="scope.row.status!='0'"  icon="el-icon-view"          @click="handleView(scope.row)" v-hasPermi="['oa:officalDoc:edit']">查看</el-button>

                        <el-button size="mini" type="text" icon="el-icon-view" v-show="scope.row.draftStatus=='0'" @click="seal(scope.row)" v-hasPermi="['oa:officalDoc:edit']" style="color: #f56c6c;">签章</el-button>
                        <el-button size="mini" type="text" icon="el-icon-view" @click="preview(scope.row)" v-hasPermi="['oa:officalDoc:edit']" style="color: #00afff;">预览</el-button>
                        <el-button size="mini" type="text" icon="el-icon-bottom" @click="downloadFile(scope.row)" v-hasPermi="['oa:officalDoc:edit']" style="color: #00afff;">下载文件</el-button>
<!--                        <el-button size="mini" type="text" icon="el-icon-edit" @click="confirmDoc(scope.row)" v-hasPermi="['oa:officalDoc:edit']" style="color: #f56c6c;">定稿</el-button>-->
                    </template>
                </el-table-column>
            </el-table>

            <pagination v-show="total>0" :total="total" :page.sync="queryParams.pageNum" :limit.sync="queryParams.pageSize" @pagination="getList"/>
        </TableCard>


        <el-dialog title="预览" :visible.sync="openPreviewDialog" width="1000px" append-to-body>
            <iframe :src="previewUrl" class="previewIframe"/>
        </el-dialog>


        <FlowInfo :businessId="businessId" :billType="billType" v-if="showFlowInfo" :showStatus="showFlowInfo" @closeFlowInfoDialog="closeFlowInfoDialog"></FlowInfo>


    </div>
</template>

<script>
import {listOfficalDoc, getOfficalDoc, delOfficalDoc, addOfficalDoc, updateOfficalDoc, sealDoc} from "@/api/oa/officalDoc";
import {cancleFlow, submitFlow} from "@/api/workflow/processInstance";
import FlowInfo from "@/views/workflow/flow/flowInfo";
export default {
    name: "OfficalDoc",
    dicts: ['offical_doc_encryption_level', 'oa_flow_billstatus','offical_doc_encryption_level','offical_doc_secret_period','offical_doc_public_category','offical_doc_emergent_level'],
    components:{FlowInfo},
    data() {
        return {
            billType:"",
            showFlowInfo:false,
            businessId:null,
            //预览
            openPreviewDialog:false,
            previewUrl:"",
            // 遮罩层
            loading: true,
            // 显示搜索条件
            showSearch: true,
            // 总条数
            total: 0,
            // 公文发文表格数据
            officalDocList: [],
            // 查询参数
            queryParams: {
                pageNum: 1,
                pageSize: 20,
                orderByColumn: "createTime",
                isAsc: "descending",
                redHeadId: null,
                title: null,
                content: null,
                secretLevel: null,
                docDeptName: null,
                year: null,
                num: null,
                qizi: null,
                draftStatus: null,
                url: null,
                billType: null,
                billCode: null,
                flowKey: null,
                flowInsId: null,
                submitTime: null,
                status: null,
                tenantId: null
            },
            // 表单校验
            rules: {
                redHeadId: [
                    {required: true, message: "套红id不能为空", trigger: "blur"}
                ],
                title: [
                    {required: true, message: "标题不能为空", trigger: "blur"}
                ],
                content: [
                    {required: true, message: "公文内容不能为空", trigger: "blur"}
                ],
                year: [
                    {required: true, message: "年份不能为空", trigger: "blur"}
                ],
                num: [
                    {required: true, message: "第几号文不能为空", trigger: "blur"}
                ],
                qizi: [
                    {required: true, message: "企字不能为空", trigger: "blur"}
                ],
            }
        };
    },
    created() {
        const billType = this.$route.query && this.$route.query.billType;
        console.log("单据类型："+billType)
        if(billType){
            this.queryParams.billType = billType;
            this.billType = billType;
        }
        this.getList();
    },
    methods: {
        /** 查询公文发文列表 */
        getList() {
            this.loading = true;
            listOfficalDoc(this.queryParams).then(response => {
                this.officalDocList = response.rows;
                this.total = response.total;
                this.loading = false;
            });
        },
        /** 搜索按钮操作 */
        handleQuery() {
            this.queryParams.pageNum = 1;
            this.getList();
        },
        /** 重置按钮操作 */
        resetQuery() {
            this.resetForm("queryForm");
            this.handleQuery();
        },
        /** 新增按钮操作 */
        handleAdd() {
            this.$router.push({path: "/oa/officalDoc/officalDoc/form/add/"+this.billType})
        },
        /** 修改按钮操作 */
        handleUpdate(row) {
            const id = row.id
            this.$router.push({path: "/oa/officalDoc/officalDoc/form/" + row.id});
        },
        /** 查看单据详情 */
        handleView(row){
            this.$router.push({path: "/oa/officalDoc/officalDoc/form/" + row.id, query: {readonly:"1"}})
        },
        /** 删除按钮操作 */
        handleDelete(row) {
            const ids = row.id || this.ids;
            this.$modal.confirm('是否确认删除公文发文编号为"' + ids + '"的数据项？').then(function () {
                return delOfficalDoc(ids);
            }).then(() => {
                this.getList();
                this.$modal.msgSuccess("删除成功");
            }).catch(() => {
            });
        },
        /** 导出按钮操作 */
        handleExport() {
            this.download('oa/officalDoc/export', {
                ...this.queryParams
            }, `officalDoc_${new Date().getTime()}.xlsx`)
        },
        //生成文件
        seal(row){
            sealDoc(row.id).then(res=>{
                if(200==res.code){
                    this.$modal.msgSuccess("生成成功");
                    this.getList();
                }
            })
        },
        //下载文件
        downloadFile(row){
            this.$download.resource(row.url);
        },
        // 预览
        preview(row){
            if(this.util.isEmpty(row.url)){
                this.$modal.msgError("请先生成文件");
                return;
            }
            this.openPreviewDialog = true;
            this.previewUrl = process.env.VUE_APP_BASE_API + row.url;
        },
        //定稿
        confirmDoc(row){
            let data = {
                id:row.id,
                draftStatus:"1"
            }
            updateOfficalDoc(data).then(response => {
                this.$modal.msgSuccess("定稿成功");
                this.getList();
            });
        },





        /** 提交审批 ***/
        doSubmitFlow(row){
            let data = {
                businessId:row.id,
                billType: row.billType
            }
            this.$modal.confirm('确认要提交该单据进行审批吗？').then( ()=> {
                return submitFlow(data);
            }).then(() => {
                this.getList();
                this.$modal.msgSuccess("提交成功");
            }).catch(() => {
            });
        },
        /** 取回审批 ***/
        doCancleFlow(row){
            let data = {
                businessId:row.id,
                billType: row.billType
            }
            this.$modal.confirm('确认要取回该协议审批吗？').then( ()=> {
                cancleFlow(data).then(res=>{
                    if(200==res.code){
                        this.getList();
                        this.$modal.msgSuccess("取回成功");
                    }
                });
            })
        },
        /** 流程信息 ***/
        flowDetail(row){
            this.businessId = row.id+"";
            this.showFlowInfo = true;
        },
        //关闭流程信息窗口
        closeFlowInfoDialog(){
            this.showFlowInfo = false;
        },

    }
};
</script>
<style lang="scss" scoped>
    .previewIframe{
        width: 100%;
        height: 800px;
        border: none;
    }
</style>
